<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css" media="screen">
.my-uploadify-button {
	background:none;
	border: none;
	text-shadow: none;
	border-radius:0;
}

.uploadify:hover .my-uploadify-button {
	background:none;
	border: none;
}

.fileQueue {
	width: 400px;
	height: 150px;
	overflow: auto;
	border: 1px solid #E5E5E5;
	margin-bottom: 10px;
}
</style>
<script type="text/javascript">
function bylawChangeFile(file) {
    alert('The file ' + file.name + ' was added to the queue.');
	//jQuery("#bylaw_fileName").text("");
console.log(file);
console.log($("#testFileInput"));
}
function bylawChangeFileclose(queueData) {
	
    alert(queueData.filesQueued + ' files were queued of ' + queueData.filesSelected + ' selected files. There are ' + queueData.queueLength + ' total files in the queue.');
    console.log(queueData);
}

function deleteImg(){
	//alert($('#imageFileName').attr('value'));
	url="${ctx}/deleteImageFile?Filename="+$('#imageFileName').attr('value');
	url = encodeURI(url);
	//alert(url);
	//processSimpleRequest(url) ;
	
	jQuery.post(url, {}, function(json) {
		$('#imageFileName').attr('value','');
		  $('#imageShow').attr('src','${ctx}/uploadFiles/default.jpg'); 
			$('#imageShow').show();
			DWZ.ajaxDone(json.ajaxReturn);
		});
	
}
</script>
</head>
<body>
<form action="">
	<h2 class="contentTitle">uploadify多文件上传</h2>


<div class="pageContent" style="margin: 0 10px" layoutH="50">
<input type="text" id="imageFileName"/>
		<input id="testFileInput" type="file"
			uploaderOption="{
			swf:'${ctx}/scripts/dwz/uploadify/scripts/uploadify.swf',
			uploader:'${ctx}/uploadifyDemoUpload',
			formData:{PHPSESSID:'xxx', ajax:1},
			buttonText:'请选择文件',
			fileObjName: 'imageFile',  
			fileSizeLimit:'200KB',
			fileTypeDesc:'*.jpg;*.jpeg;*.gif;*.png;',
			fileTypeExts:'*.jpg;*.jpeg;*.gif;*.png;',
			'queueSizeLimit' : 1,
			auto:true,
			multi:false,
			 'wmode'          : 'transparent' ,  
			  'rollover'       : true,
			  queueID:'fileQueue',
			      'onInit': function () {                        //载入时触发，将flash设置到最小
               $('#fileQueue').hide();
                      },
			onUploadSuccess: function(file, data, response) {
                                 // alert(data);
                                var retdata = eval('(' + data + ')');
                                
                                $('#imageFileName').attr('value',retdata.ajaxReturn.message);
                                $('#imageShow').attr('src','${ctx}/uploadFiles/'+retdata.ajaxReturn.message); 
									$('#imageShow').show();
                                
                                
                                
                            }
			
		}" />
		<div id="fileQueue" class="fileQueue"></div>
		<input type="button" onclick="javascript:deleteImg()">del</input>
<input type="image" id = "imageShow" src="${ctx}/uploadFiles/default.jpg" height="200" width="200" />

	<div class="divider"></div>
	<p style="margin:10px"><a href="http://www.uploadify.com/documentation/" target="_blank">Uploadify 在线文档</a></p>
	</form>
<textarea cols="160" rows="10">
uploaderOption: http://www.uploadify.com/documentation/
	auto            : true,               // Automatically upload files when added to the queue
	buttonClass     : '',                 // A class name to add to the browse button DOM object
	buttonCursor    : 'hand',             // The cursor to use with the browse button
	buttonImage     : null,               // (String or null) The path to an image to use for the Flash browse button if not using CSS to style the button
	buttonText      : 'SELECT FILES',     // The text to use for the browse button
	checkExisting   : false,              // The path to a server-side script that checks for existing files on the server
	debug           : false,              // Turn on swfUpload debugging mode
	fileObjName     : 'Filedata',         // The name of the file object to use in your server-side script
	fileSizeLimit   : 0,                  // The maximum size of an uploadable file in KB (Accepts units B KB MB GB if string, 0 for no limit)
	fileTypeDesc    : 'All Files',        // The description for file types in the browse dialog
	fileTypeExts    : '*.*',              // Allowed extensions in the browse dialog (server-side validation should also be used)
	height          : 30,                 // The height of the browse button
	itemTemplate    : false,              // The template for the file item in the queue
	method          : 'post',             // The method to use when sending files to the server-side upload script
	multi           : true,               // Allow multiple file selection in the browse dialog
	formData        : {},                 // An object with additional data to send to the server-side upload script with every file upload
	preventCaching  : true,               // Adds a random value to the Flash URL to prevent caching of it (conflicts with existing parameters)
	progressData    : 'percentage',       // ('percentage' or 'speed') Data to show in the queue item during a file upload
	queueID         : false,              // The ID of the DOM object to use as a file queue (without the #)
	queueSizeLimit  : 999,                // The maximum number of files that can be in the queue at one time
	removeCompleted : true,               // Remove queue items from the queue when they are done uploading
	removeTimeout   : 3,                  // The delay in seconds before removing a queue item if removeCompleted is set to true
	requeueErrors   : false,              // Keep errored files in the queue and keep trying to upload them
	successTimeout  : 30,                 // The number of seconds to wait for Flash to detect the server's response after the file has finished uploading
	uploadLimit     : 0,                  // The maximum number of files you can upload
	width           : 120,                // The width of the browse button
</textarea>

</div>
</body>
</html>